<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>新增菜单</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="${resRoot}/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="${resRoot}/layui/admin/admin.css" media="all" />
	<link id="layuicss-layer" rel="stylesheet" href="${resRoot}/layui/css/modules/layer/default/layer.css" media="all">
</head>
<body class="childrenBody">
<div class="layui-fluid">   
          <div class="layui-card">
          <div class="layui-card-body">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend>系统菜单管理-<#if menuDTO??>更新<#else>新增</#if></legend>
</fieldset>
<form class="layui-form" action="">
	<input type="hidden" id="id" name="id" value="<#if menuDTO??>${menuDTO.id}<#else>0</#if>" >
	<div class="layui-form-item">
	    <label class="layui-form-label">菜单名称</label>
	    <div class="layui-input-block">
	      <input type="text" name="name" id="name" lay-verify="required" autocomplete="off" value="<#if menuDTO??>${menuDTO.name}</#if>" placeholder="请输入菜单名称" class="layui-input">
	    </div>
  	</div>
  	<div class="layui-form-item">
	    <label class="layui-form-label">父菜单</label>
	    <div class="layui-input-block">
	      <input type="text" name="parentName" id ="parentName" autocomplete="off" value="<#if menuParentVO??>${menuParentVO.name}</#if>"  class="layui-input" disabled="" >
	      <input type="hidden" name="parentId" id ="parentId"  value="<#if menuDTO??>${menuDTO.parentId}<#else>${menuParentVO.id}</#if>"   >
	    </div>
  	</div>
  	<#if menuParentVO.id == 0>
  	<div class="layui-form-item">
	    <label class="layui-form-label">选择节点</label>
	    <div class="layui-input-block" id="menuTree">
	    </div>
  	</div>
  	</#if>
  	<div class="layui-form-item">
	    <label class="layui-form-label">菜单链接</label>
	    <div class="layui-input-block">
	      <input type="text" name="url" id="url" lay-verify="titel" value="<#if menuDTO?? && menuDTO.url?? && menuDTO.url!= ''>${menuDTO.url}</#if>" autocomplete="off" placeholder="请输入菜单URL" class="layui-input">
	    </div>
  	</div>
  	<div class="layui-form-item">
	    <label class="layui-form-label">菜单权限</label>
	    <div class="layui-input-block">
	      <input type="text" name="perms" id="perms" lay-verify="title" value="<#if menuDTO?? && menuDTO.perms?? && menuDTO.perms!='' >${menuDTO.perms}</#if>" autocomplete="off" placeholder="请输入菜单权限用','隔开" class="layui-input">
	    <div class="layui-form-mid layui-word-aux">请输入菜单权限用','隔开</div>
	    </div>
  	</div>
	
	<div class="layui-form-item">
    <label class="layui-form-label">菜单类型</label>
    <div class="layui-input-block">
      <select name="type" id="type" lay-verify="required">
        <option value=""></option>
        <option value="0" <#if menuDTO?? && menuDTO.type==0> selected="selected"</#if>>目录</option>
        <option value="1" <#if menuDTO??&&menuDTO.type==1> selected="selected"</#if> >菜单</option>
        <option value="2" <#if menuDTO??&&menuDTO.type==2> selected="selected"</#if> >按钮</option>
      </select>
    </div>
  </div>
	
	
		<div class="layui-form-item" >
    <label class="layui-form-label">菜单图标</label>
    <div class="layui-input-block">
      <i class='layui-icon layui-icon-set-fill'></i><input type="radio" name="icon" title="设置" value="&#xe614;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe614;" >checked</#if>>
      <i class='layui-icon layui-icon-list'></i><input type="radio" name="icon" title="list" value="&#xe60a;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe60a;" >checked</#if>>
      <i class="layui-icon layui-icon-chart"></i><input type="radio" name="icon" title="图表" value="&#xe62c;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe62c;" >checked</#if>>
      <i class="layui-icon layui-icon-chart-screen"></i><input type="radio" name="icon" title="报表" value="&#xe629;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe629;" >checked</#if>>
      <i class="layui-icon layui-icon-set-sm"></i><input type="radio" name="icon" title="设置" value="&#xe620;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe620;" >checked</#if> >
      <i class="layui-icon layui-icon-file"></i><input type="radio" name="icon" title="文件" value="&#xe621;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe621;" >checked</#if>>
      <i class="layui-icon layui-icon-layouts"></i><input type="radio" name="icon" title="布局" value="&#xe632;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe632;" >checked</#if>>
      <i class="layui-icon layui-icon-layer"></i><input type="radio" name="icon" title="窗口" value="&#xe638;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe638;" >checked</#if>>
      <i class="layui-icon layui-icon-form"></i><input type="radio" name="icon" title="表单" value="&#xe63c;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe63c;" >checked</#if> >
      <i class="layui-icon layui-icon-tabs"></i><input type="radio" name="icon" title="tab" value="&#xe62a;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe62a;" >checked</#if>>
      <i class="layui-icon layui-icon-add-1"></i><input type="radio" name="icon" title="新增" value="&#xe654;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe654;" >checked</#if>>
      <i class="layui-icon layui-icon-edit"></i><input type="radio" name="icon" title="编辑" value="&#xe642;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe642;" >checked</#if>>
      <i class="layui-icon layui-icon-delete"></i><input type="radio" name="icon" title="删除" value="&#xe640;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe640;" >checked</#if>>
      <i class="layui-icon layui-icon-search"></i><input type="radio" name="icon" title="搜索" value="&#xe615;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe615;" >checked</#if>>
      <i class="layui-icon layui-icon-log"></i><input type="radio" name="icon" title="记录" value="&#xe60e;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe60e;" >checked</#if>>
      <i class="layui-icon layui-icon-util"></i><input type="radio" name="icon" title="工具" value="&#xe631;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe631;" >checked</#if>>
	  <i class="layui-icon layui-icon-friends"></i><input type="radio" name="icon" title="好友" value="&#xe612;" <#if menuDTO??&&menuDTO.icon?? &&menuDTO.icon=="&#xe612;" >checked</#if>>
    </div>
  </div>
	
	<div class="layui-form-item">
		<div class="layui-inline">
      <label class="layui-form-label">排序</label>
      <div class="layui-input-inline">
        <input type="text" name="orderNum" id="orderNum"  lay-verify="required|number" autocomplete="off" class="layui-input" value="<#if menuDTO??>${menuDTO.orderNum}<#else>10</#if>" >
      </div>
    </div>
	</div>
	
	<div class="layui-form-item">
    <div class="layui-input-block">
      <button type="button" class="layui-btn" lay-submit="" onclick="save();" lay-filter="demo1">立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
      <button type="button" class="layui-btn layui-btn-primary" onclick="backList();" >返回</button>
    </div>
  </div>
</form>
</div>
	</div>
	</div>
	<script type="text/javascript" src="${resRoot}/layui/layui.js"></script>
	<script type="text/javascript" src="${resRoot}/js/jquery.min.js"></script>

<script>
function backList() {
	layer.closeAll("iframe");
    //刷新父页面
    parent.location.reload();
}
//Demo
layui.use(['tree', 'layer', 'form'], function(){
var layer = layui.layer
,$ = layui.jquery; 
	  var treeJson;

	  $.ajax({
			type : "post",
			url : "${base}/sys/menu/getMenuTree",
			data : {},
			dataType : "json",
			async : false,
			success : function(data) {
				treeJson= data.message;
			}
		}); 
	  

	  layui.tree({
		    elem: '#menuTree' //指定元素
		    ,target: '_blank' //是否新选项卡打开（比如节点返回href才有效）
		    ,click: function(item){ //点击节点回调
		      // layer.msg('当前节名称：'+ item.name + '<br>全部参数：'+ JSON.stringify(item));
		      $("#parentId").val(item.id)
		      $("#parentName").val(item.name)
		      console.log(item);
		    }
		    ,nodes: treeJson
		  });
		  //生成一个模拟树
});

function save() {
				var id = $("#id").val();
				var name =$("#name").val();
				var parentId=$("#parentId").val();
				var url=$("#url").val();
				var perms=$("#perms").val();
				var type = $("#type").val();
				var icon = $("input[name='icon']:checked").val();
				var orderNum = $("#orderNum").val();
				var flag = true;
				if(name==""|| name == null || name=="undifined") {
					alert("请输入菜单名称");
					flag = false;
					return false;
				}
				if(type==""|| type == null || type=="undifined") {
					alert("请选择菜单类型");
					flag = false;
					return false;
				}
				if(flag) {
					$.ajax({
						type : "post",
						url : "${base}/sys/menu/save",
						data : {
							id : id,
							name : name,
							parentId : parentId,
							url : url,
							perms:perms,
							type : type,
							icon : icon,
							orderNum : orderNum
							},
						dataType : "json",
						async : false,
						success : function(data) {
								if(data.message=='2') {
						layer.msg('参数不能为空！');
					} else if(data.message=='4') {
						layer.msg('保存错误！');
						} else {
							// layer.msg('保存成功！');
							layer.msg('保存成功！', {
							  icon: 1,
							  time: 2000 //2秒关闭（如果不配置，默认是3秒）
							}, function(){
							  //do something
								backList();
							});
							}
					}
					}); 
				}
			}
</script>
</body>
</html>